$avatar-r: 200px;

#avatar {
    width: $avatar-r;
    height: $avatar-r;
    border: 10px solid $clr-light;

    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
         -o-border-radius: 50%;
            border-radius: 50%;
}

.circle-img {
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: $clr-dark;
    padding: 18px;
    
    &:hover {
        opacity: 0.8;
    }
}
/*@media screen and (max-width: 760px) {
    .circle-img {
        display: none;
    }
}
*/